<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<form action="">
			<input type="text" name="" id="tt" value="" required="required" />
			<input type="email" name="" id="" value="" required="required" />
			<input type="phone" name="" id="" value="" required="required" pattern="\d{11}"/>
			<input type="submit" name="" id="" value="commit" />
			<button id="verify">verify</button>
		</form>
        <script>
        	var text = document.getElementById("tt");
        	//设置验证提示
        	text.oninvalid=function(){
			  text.setCustomValidity("请不要输入火星的手机号好吗？");
			};
			//触发验证事件
			document.getElementById("verify").onclick=function(){
				text.checkValidity();
			}
        </script>
	</body>
</html>
